$(function(){

    var pageNum = 1
    var pageSize = 2

    function init(search){
        $.ajax({
            url:'/getAllPost',
            type:'get',
            //分页查询需要参数
            data:{
                pageNum:pageNum,
                pageSize:pageSize,
                ...search
            },
            success:function(result){
                // console.log(result)
                var html = template('postListTemp',result.data)
                $('tbody').html(html)
                // 生成分页结构
                setPagenation(Math.ceil(result.data.total / pageSize))
            }
       })
    }
    init()

    // 实现分页功能
    function setPagenation(total){
        $('.pagination').bootstrapPaginator({
            // 配置
            bootstrapMajorVersion:3,
            currentPage:pageNum, //当前页码
            totalPages:total, //总页数
            onPageClicked:function(event,originalEvent,type,page){
                // page就是你当前想获取数据的页码
                // 修改全局pageNum
                pageNum = page

                // console.log(page,222222222222222222)
                //重新调用加载数据的方法
                init()
            }
        })    
    } 
    
    
    // 加载分类数据
    $.ajax({
        type:'get',
        url:'/getAllCate',
        dataType:'json',
        success:function(res){
            // console.log(res)
            // 生成分类下拉列表动态结构
            var str = '<option value="all">所有分类</option>'
            for( var i =0;i<res.data.length;i++){
                str +=`<option value="${res.data[i].id}">${res.data[i].name}</option>`
            }
            $('.cateSelector').html(str)
        }
    })
    // 实现筛选功能
    $('.btn-search').on('click',function(){
        // 收集数据
        var obj = {
            cate:$('.cateSelector').val(),
            status:$('.statuSelector').val()
        }
        // console.log(obj)
        // 发送ajax请求
        init(obj)
    })

    // 实现文章的删除
    $('tbody').on('click','.btnDel',function(){
        // console.log($(this))
        var id = $(this).data('id')
        // console.log(id)
        // 弹出确认框
        if(confirm('请问是否真的需要删除？')){
        $.ajax({
            url:'/delPostById?id='+id,
            type:'get',
            dataType:'json',
            success:function(res){
                if(res.code===200){
                    $('.alert-danger > span').text(res.msg)
                    $('.alert-danger').fadeIn(500).delay(3000).fadeOut(500)
                    location.href='http://127.0.0.1:8080/admin/posts'

                }
            }
        })
        }
    })


    // 为编辑添加委托事件
    // $('tbody').on('click','.btnEdit',function(){
    //     // console.log(123)
    //     // 我们为什么建议使用自定义属性进行数据的存储，并不在于它存储更方便，而在于它获取数据更方便，不管是原生js，还是jq，都是获取到对象，并且这个对象中包含所有的自定义属性的数据
    //     // 原生方法
    //     // console.log($(this)[0].dataset['id'])
    //     // jq方式
    //     // console.log($(this).data("id"))
    //     let id = $(this).data("id")
    //     location.href='/admin/post-add?id='+id
    // })
})